<!-- 首页 -->
<template>
	<view class="container">
		<view class="c-form">
			<view class="form-info">
				<u-form :model="studentInfo" ref="form" :rules="rules" labelWidth="200rpx">
					<u-form-item label="机构名称" prop="organ_name" required>
						<view class="" style="width: 100%;z-index: 99999;">
							<uni-combox @input="searchOrg" :candidates="orgList" placeholder="输入培训机构名称搜索" v-model="studentInfo.organ_name" :emptyTips="emptyTips" :disabled="isDisabled"></uni-combox>
						</view>
					</u-form-item>
					<u-form-item label="指导老师" v-if="addType=='teacher'" required prop="train_teacher_name">
						<u-input placeholder="输入指导老师名称" v-model="studentInfo.train_teacher_name" disabled>
						</u-input>
					</u-form-item>
					<u-form-item label="指导老师" prop="train_teacher_name" required v-if="addType=='org'">
						<!-- <uni-data-select v-model="studentInfo.train_teacher_name" emptyText="无机构老师信息" 
							:localdata="groupList" placeholder="选择机构内指导老师" @change="groupChange">
						</uni-data-select> -->
						<u-input placeholder="输入指导老师名称" v-model="studentInfo.train_teacher_name"></u-input>
					</u-form-item>
					
					<u-form-item label="老师联系方式" prop="train_teacher_mobile" required>
						<u-input placeholder="输入指导老师联系方式" v-model="studentInfo.train_teacher_mobile"
							:disabled="addType=='teacher'"></u-input>
					</u-form-item>
					<u-form-item label="姓名" prop="name" required>
						<u-input placeholder="输入姓名" v-model="studentInfo.name" @blur="nameBlur" :disabled="isDisabled">
						</u-input>
					</u-form-item>
					<u-form-item label="拼音" required>
						<u-input placeholder="姓名拼音" v-model="studentInfo.pinyin" disabled></u-input>
					</u-form-item>
					<u-form-item label="民族" prop="nation" required>
						<u-input placeholder="输入民族" v-model="studentInfo.nation" :disabled="isDisabled"></u-input>
					</u-form-item>
					<u-form-item label="国籍" prop="national" required>
						<u-radio-group v-model="studentInfo.national" :value="studentInfo.national"
							:disabled="isDisabled">
							<u-radio label="中国" :name="1"></u-radio>
							<u-radio :customStyle="{marginLeft:'40rpx'}" label="港澳台" :name="2"></u-radio>
							<u-radio :customStyle="{marginLeft:'40rpx'}" label="国外" :name="3"></u-radio>
						</u-radio-group>
					</u-form-item>
					<u-form-item label="证件类型" prop="document_type" labelPositon="top" required>
						<u-radio-group v-model="studentInfo.document_type" :disabled="isDisabled">
							<u-radio label="身份证" :name="1"></u-radio>
							<u-radio :customStyle="{marginLeft:'40rpx'}" label="护照" :name="2"></u-radio>
						</u-radio-group>
					</u-form-item>
					<u-form-item label="证件号码" prop="document_nums" required>
						<u-input placeholder="输入证件号码" v-model="studentInfo.document_nums" :disabled="!studentInfo.document_type">
						</u-input>
					</u-form-item>
					<u-form-item label="性别" prop="sex" required>
						<u-radio-group v-model="studentInfo.sex" :disabled="!studentInfo.document_type || studentInfo.document_type==1">
							<u-radio label="男" :name="1"></u-radio>
							<u-radio :customStyle="{marginLeft:'40rpx'}" label="女" :name="2"></u-radio>
						</u-radio-group>
					</u-form-item>
					<u-form-item label="出生日期" prop="birth" required>
						<view class="" @click="!studentInfo.document_type || studentInfo.document_type==1?false:dateShow = true">
							<u-input placeholder="选择出生日期" v-model="studentInfo.birth" disabled></u-input>
						</view>
						<u-datetime-picker :show="isDisabled?false:dateShow" mode="date" @cancel="dateShow = false"
							@confirm="datePickerConfirm" :minDate="minStamp" :maxDate="maxStamp"></u-datetime-picker>
					</u-form-item>
					<u-form-item label="联系人" prop="contact_name" required>
						<u-input placeholder="输入联系人" v-model="studentInfo.contact_name" :disabled="isDisabled">
						</u-input>
					</u-form-item>
					<u-form-item label="联系电话" prop="contact_mobile" required>
						<u-input placeholder="输入联系人电话" v-model="studentInfo.contact_mobile" :disabled="isDisabled">
						</u-input>
					</u-form-item>
					<u-form-item label="证件照(2寸)" prop="document_img" labelPosition="top" required>
						<view class="" style="margin: 0 auto;">
							<u-upload width="200rpx" height="200rpx" :uploadIconColor="'#666'" :uploadIcon="'plus'"
								:fileList="filePath" :previewFullImage="true" @afterRead="afterRead" @delete="deletePic"
								name="1" :maxCount="1"></u-upload>
						</view>
					</u-form-item>
					<u-form-item label="邮寄地址" prop="contact_address" required>
						<u-textarea v-model="studentInfo.contact_address" placeholder="输入收货地址" autoHeight
							:disabled="isDisabled"></u-textarea>
					</u-form-item>
					<u-form-item v-if="!isDisabled">
						<u-button text="保存" type="primary" @click="saveForm" shape="circle"></u-button>
					</u-form-item>
				</u-form>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "",
		data() {
			return {
				// 机构选择提示
				emptyTips:"无匹配机构名称",
				// 搜索机构列表
				orgList:[],
				// 添加学生信息后是否返回报名页
				isBack:false,
				// 指导老师列表
				groupList:null,
				// 添加操作的身份
				addType:'teacher',
				// 是否添加学生信息
				isAdd: false,
				// 是否禁填
				isDisabled: true,
				// 照片
				filePath: [],
				// 日期选择器控件状态
				dateShow: false,
				// 用户身份
				status: this.$store.state.status,
				// 学生信息
				studentInfo: {
					comp_type: 2,
					name: null,
					pinyin: null,
					sex: null,
					birth: null,
					national: null,
					nation: null,
					organ_name: null,
					train_teacher_name: null,
					train_teacher_mobile: null,
					document_type: null,
					document_nums: null,
					document_img: null,
					contact_name: null,
					contact_mobile: null,
					contact_address: null
				},
				// 表单校验
				rules: {
					'name': {
						required: true,
						message: '请填写姓名',
						trigger: ['blur']
					},
					'document_nums': [{
							required: true,
							message: '请填写证件号码',
							trigger: ['blur']
						},
						{
							message: '身份证号码错误',
							trigger: ['blur'],
							validator: (rule, value, callback) => {
								if (uni.$u.test.idCard(value)) {
									let birth = value.slice(6, 14)
									this.studentInfo.birth =
										`${birth.slice(0,4)}-${birth.slice(4,6)}-${birth.slice(6,8)}`
									this.studentInfo.sex = value.slice(16, 17) % 2 == 0 ? 2 : 1
									return true
								} else {
									if (this.studentInfo.document_type == 1) {
										return false
									} else {
										return
									}
								}
							},
						}
					],
					'sex': {
						type:'number',
						required: true,
						message: '请选择性别',
						trigger: ['change']
					},
					'birth': {
						required: true,
						message: '请选择生日',
						trigger: ['change']
					},
					'national': {
						type:'number',
						required: true,
						message: '请选择国籍',
						trigger: ['change']
					},
					'nation': {
						required: true,
						message: '请填写民族',
						trigger: ['blur']
					},
					'organ_name': {
						required: true,
						message: '请填写培训机构',
						trigger: ['blur']
					},
					'train_teacher_name': {
						required: true,
						message: '请填写指导老师姓名',
						trigger: ['blur']
					},
					'train_teacher_mobile': {
						required: true,
						message: '请填写指导老师联系电话',
						trigger: ['blur']
					},
					'document_type': {
						type:'number',
						required: true,
						message: '请选择证件类型',
						trigger: ['change']
					},
					'document_img': {
						required: true,
						message: '请上传证件照',
						trigger: ['blur']
					},
					'contact_name': {
						required: true,
						message: '请填写联系人姓名',
						trigger: ['blur']
					},
					'contact_mobile': {
						required: true,
						message: '请填写联系人电话',
						trigger: ['blur']
					},
					'contact_address': {
						required: true,
						message: '请填写邮寄地址',
						trigger: ['blur']
					},
				
				}
			}
		},
		onLoad(query) {
			this.isBack = query.back
			if (query.type == 'add') {
				this.isAdd = true
				this.isDisabled = false

				switch (this.status){
					case "teacher":
					this.addType = 'teacher'
						this.getTeacherInfo()
						break;
					case "org":
						this.studentInfo.comp_type = 3
						this.addType = 'org'
						this.getOrgInfo()
						// this.getOrgTeacherList()
						break;
				}
			} else if (query.sn) {
				this.searchStudentInfo(query.sn)
			}

		},
		onReady() {
			//onReady 为uni-app支持的生命周期之一
			this.$refs.form.setRules(this.rules)
		},
		methods: {
			// 搜索机构名称
			searchOrg(val){
				this.emptyTips = "正在搜索中..."
				this.$http.getOrgList({organ_name:val}).then(res=>{
					this.emptyTips = "无匹配机构名称"
					this.orgList = res.data.map(item=>{
						return item.name
					})
				})
			},
			// 选择组别
			groupChange(e) {
				for (let item of this.groupList) {
					if (item.value == e) {
						this.otherInfo.all_group_name = item.text
						continue
					}
				}
			},
			// 机构获取老师信息列表
			getOrgTeacherList() {
				this.$http.getOrgTeacherList().then(res => {
					this.groupList = res.data.map(item => {
						return {
							text: item.all_group_name,
							value: item.id,
							disable:item.is_apply==0?true:false
						}
					})
				})
			},
			// 获取机构信息
			getOrgInfo(){
				this.$http.getOrgInfo().then(res=>{
					this.orgInfo = res
				}).catch(err => {
					uni.$u.toast(err.msg)
				})
			},
			// 获取老师信息
			getTeacherInfo(){
				this.$http.getTeacherInfo().then(res=>{
					this.studentInfo.train_teacher_name = res.name
					this.studentInfo.train_teacher_mobile = res.mobile
				})
			},
			// 根据证件号查询学生信息
			searchStudentInfo(sn) {
				this.$http.searchStudentInfo({document_nums:sn}).then(res => {
					this.studentInfo = res
					this.filePath = [{
						url: this.baseURL + res.document_img
					}]
				})
			},
			// 姓名填写完成
			nameBlur() {
				this.$http.parserPinyin({
					words: this.studentInfo.name
				}).then(res => {
					this.studentInfo.pinyin = res
				})
			},
			// 图片上传后
			afterRead(e) {
				// 微信小程序不支持多张图片上传
				uni.uploadFile({
					url: this.baseURL + '/api/common/upload',
					filePath: e.file.url,
					name: 'file',
					header: {
						"token": this.$store.state.token
					},
					success: (res) => {
						if (res.statusCode == 200) {
							let result = JSON.parse(res.data)
							let {
								data: {
									url,
									fullurl
								}
							} = result
							this.filePath.push({
								url: fullurl
							})
							this.studentInfo.document_img = url
						} else {
							let result = JSON.parse(res.data)
							uni.$u.toast(result.msg)
						}

					},
					fail: (err) => {
						uni.$u.toast(err)
					}
				})
			},
			// 删除图片
			deletePic(e) {
				if (this.isDisabled) return
				this.filePath = []
			},
			// 日期选择
			datePickerConfirm(obj) {
				this.dateShow = false
				this.studentInfo.birth = uni.$u.timeFormat(obj.value)
			},
			// 保存完善信息
			saveForm() {
				this.$refs.form.validate().then(res => {
					this.$http.savePersonalInfo(this.studentInfo).then(res => {
						this.isDisabled = true
						this.isAdd=false
						uni.$u.toast("信息保存成功")
						uni.$emit("addStudentInfo",{document:this.studentInfo.document_nums})
						if(this.isBack){
							setTimeout(()=>{
								this.navigateBack()
							},1000)
						}
					}).catch(err=>{
						uni.$u.toast(err.msg)
					})
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.container {
		.c-form {
			.form-info{
				padding-top: 90rpx;
				background-color: #fff;
				padding: 0 30rpx;
				box-sizing: border-box;
			}
		}

	}
</style>
